<!--<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<c:set var="path" value="${pageContext.request.contextPath}" />-->
<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<title>合格供货方管理</title>
<link rel="stylesheet" type="text/css"
	href="/Medical_Instrument/statics/h-ui/css/H-ui.min.css" />
<link rel="stylesheet" type="text/css"
	href="/Medical_Instrument/statics/h-ui.admin/css/H-ui.admin.css" />
<link rel="stylesheet" type="text/css"
	href="/Medical_Instrument/statics/lib/Hui-iconfont/1.0.8/iconfont.css" />
<link rel="stylesheet" type="text/css"
	href="/Medical_Instrument/statics/h-ui.admin/skin/default/skin.css" id="skin" />
<link rel="stylesheet" type="text/css"
	href="/Medical_Instrument/statics/h-ui.admin/css/style.css" />
<style type="text/css">
* {
	margin: 0;
	padding: 0;
}

body {
	background: linear-gradient(#DCEBFF, #DCEBFF, #D3E6FF, #BFDBFF);
}

h2 {
	text-align: center;
	line-height: 40px;
}

.buttons {
	position: absolute;
	top: 0px;
	right: 20px;
	display: block;
	font-size: 14px;
	border-radius: 5px;
	border: 1px solid #9DA0A4;
	padding: 4px;
	width: 100px;
	text-align: center;
	background: linear-gradient(#DEECFF, #CAE1FF, #B6D6FF);
	color: #1E90FF;
}

.buttons:hover {
	cursor: pointer;
	background: -webkit-linear-gradient(#B6D6FF, #CAE1FF, #DEECFF);
	background: -moz-linear-gradient(#B6D6FF, #CAE1FF, #DEECFF);
	background: -o-linear-gradient(#B6D6FF, #CAE1FF, #DEECFF);
	background: -webkit-gradient(linear, 0 0, 0 100%, from(#B6D6FF),
		color-stop(0.5, #CAE1FF), to(#DEECFF) );
	background: linear-gradient(#B6D6FF, #CAE1FF, #DEECFF);
}

ul li {
	display: inline-block;
	background: dodgerblue;
	color: white;
	text-align: center;
}

li:hover {
	cursor: pointer;
}

input {
	border: 1px solid #B3C7E1;
	line-height: 40px;
	text-indent: 5px;
}

ol li {
	margin-bottom: 5px;
}

.red {
	color: red;
}

.back-color {
	background-color: red;
}

.people {
	width: 210px;
	display: inline-block;
	vertical-align: top;
}

.people-two {
	width: 95px;
	height: 23px;
}

.people li span {
	display: inline-block;
	width: 90px;
	text-align: right;
}

.people:last-of-type li span {
	width: 120px;
}

.people-three {
	width: 168px;
	height: 23px;
}

.input-back {
	background: #F0F0F0;
}

.modal-body-content {
	border: 2px solid #1E90FF;
	padding: 5px;
	height: 600px;
	overflow-x: auto;
	overflow-y: auto;
}

.upper {
	display: block;
}

.lower {
	display: none;
}

.contents {
	width: 1500px;
	margin-left: 30px;
	display: inline-block;
	overflow-x: auto;
	overflow-y: auto;
	height: 700px;
	border: 5px solid #1E90FF;
	padding: 20px;
	position: relative;
}

#DataTables_Table_1_info {
	position: absolute;
	bottom: 45px;
	left: 30px;
}

#DataTables_Table_1_paginate {
	position: absolute;
	bottom: 45px;
	right: 30px;
}
</style>
</head>

<body>
	<h2>供应商管理</h2>
	<div class="contents cont_right">
		<table id="providerList"
			class="table table-border table-bordered table-hover table-bg no-footer"
			width="4000">
			<thead>
				<tr class="text-c">
					<th>编号</th>
					<th>全称</th>
					<th>拼音码</th>
					<th>地址</th>
					<th>联系人</th>
					<th>联系电话</th>
					<th>是否审核</th>
					<th>应付额</th>
					<th>应收额</th>
					<th>预付款</th>
					<th>账户</th>
					<th>税号</th>
					<th>公司电话</th>
					<th>邮政编码</th>
					<th>法人</th>
					<th>开户行</th>
					<th>许可证编号</th>
					<th>统一社会信用代码</th>
					<th>质量认证情况</th>
					<th>质量机构负责人</th>
					<th>质量机构人数</th>
					<th>质量机构联系方式</th>
					<th>许可证有效期</th>
					<th>营业执照有效期</th>
					<th>委托书有效期</th>
					<th>质保协议有效期</th>
					<th>品种控制</th>
					<th>备案凭证编号</th>
				</tr>
			</thead>
			<tbody>
			</tbody>
		</table>
	</div>
	<div style="display: inline-block;">
		<button class="buttons" style="top: 80px;" data-toggle="modal"
			id="look" data-target="#select" onclick="lookProvider()">查看</button>
		<button class="buttons" style="top: 120px;">打印档案</button>
		<button class="buttons" style="top: 160px;" onclick="uploadPic()">上传营业执照信息</button>
	</div>

	<!-- 查看供货方弹出框 -->
	<div class="modal inmodal fade" id="select" tabindex="-1" role="dialog"
		aria-hidden="true" style="z-index: 50;overflow-y:auto;">
		<div class="modal-dialog modal-lg"
			style="width:960px; height:700px;margin:20px auto;">
			<div class="modal-content" style="width:960px;">
				<div class="modal-header"
					style="background: linear-gradient(#FFFFFF,#E8F2FF,#BDD9FF);">
					<button type="button" class="close" data-dismiss="modal">
						<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
					</button>
					<h4 class="modal-title"
						style="font-size: 26px; font-weight: 600; text-align: center; ">供应商资料</h4>
				</div>
				<div class="modal-body"
					style="background: linear-gradient(#EDF2FA,#BFD3EC,#A2BFE5);">
					<ul>
						<li style="width: 80px;" onclick="change_back($(this),1)">基本信息</li>
						<li style="width: 0px"></li>
						<li style="width: 120px; background: lightsteelblue;"
							onclick="change_back($(this),2)">供货方人员信息</li>
					</ul>
					<div class="modal-body-content">
						<div class="upper">
							<form action="" id="providerInfoForm">
								<div class="Essential-infor">
									<div style="margin: 0 0 5px 654px;">
										备案凭证编号 <input type="text" disabled="disabled"
											class="people-three input-back" name="recordsNo" />
									</div>
									<ol style="width: 415px; display: inline-block;">
										<li><span class="red">经营类别</span> <select
											name="manageType" style="width: 190px; height: 23px;"
											disabled="disabled">
												<option value="1">生产企业</option>
												<option value="2">经营企业</option>
										</select> &nbsp;<span>供方编号</span> <input type="text"
											name="supplierEnterpriseNo"
											style="width: 94px; height: 23px;" readonly='readonly' />
										</li>
										<li><span class="red">企业名称</span> <input type="text"
											name="enterpriseName" style="width: 188px; height: 23px;"
											readonly='readonly' /> &nbsp; <span>输入码</span> <input
											name="inputCode" type="text"
											style="width: 94px; height: 23px;" readonly='readonly' />
										</li>
										<li><span class="red">注册地址</span> <input type="text"
											name="registerAddress" style="width: 351px; height: 23px;"
											readonly='readonly' /></li>
										<li><span class="red">仓库地址</span> <input type="text"
											name="warehouseAddress" style="width: 351px; height: 23px;"
											readonly='readonly' /></li>
										<li><span class="red">开户银行</span> <input type="text"
											name="bank" style="width: 351px; height: 23px;"
											readonly='readonly' /></li>
										<li><span class="red">银行账户</span> <input type="text"
											name="bankAccount" style="width: 351px; height: 23px;"
											readonly='readonly' /></li>
										<li><span><span style="opacity: 0;">税号</span>税号</span> <input
											name="dutyNo" type="text" style="width: 351px; height: 23px;"
											readonly='readonly' /></li>
										<li><span>公司电话</span> <input type="text"
											name="enterprisePhone" style="width: 208px; height: 23px;"
											readonly='readonly' /> <span>邮政编码</span> <input type="text"
											style="width: 76px; height: 23px;" name="postcode"
											readonly='readonly' /></li>
										<li><span>应收额</span> <input type="text"
											style="width: 76px; height: 23px;" readonly='readonly' />&nbsp;&nbsp;<span>应付额</span>
											<input type="text" style="width: 76px; height: 23px;"
											readonly='readonly' /> &nbsp;&nbsp; <span>预付款</span> <input
											type="text" style="width: 77px; height: 23px;"
											readonly='readonly' />
										</li>
									</ol>

									<ol class="people">
										<li><input type="checkbox" name="varietyControl" />品种控制
											<input type="checkbox" name="sellColdItem" />允许经营冷藏品</li>
										<li><span class="red">联系人</span> <input type="text"
											class="people-two" readonly='readonly' name="linkman" /></li>
										<li><span class="red">法定代表人</span> <input type="text"
											class="people-two" readonly='readonly' name="legalPerson" />
										</li>
										<li><span class="red">企业负责人</span> <input type="text"
											name="enterprisePerson" class="people-two"
											readonly='readonly' /></li>
										<li><span class="red">质量负责人</span> <input type="text"
											name="qualityDirecter" class="people-two" readonly='readonly' />
										</li>
										<li><span style="font-size: 12px;">组织机构代码证</span> <input
											name="organizationNo" type="text" class="people-two"
											readonly='readonly' /></li>
										<li><span class="red">许可证编号</span> <input type="text"
											name="licenseNo" class="people-two" readonly='readonly' /></li>
										<li><span class="red">营业执照编号</span> <input type="text"
											name="organizationNo" class="people-two" readonly='readonly' />
										</li>
									</ol>
									<ol class="people" style="width: 295px; margin-left: -15px;">
										<li><span class="red">建档时间</span> <input type="text"
											name="inputDate" disabled="disabled"
											class="people-three input-back" /></li>
										<li><span class="red">联系电话</span> <input type="text"
											name="enterprisePhone" class="people-three"
											readonly='readonly' /></li>
										<li><span class="red">质量认证情况</span> <input type="text"
											name="qualitySituation" class="people-three"
											readonly='readonly' /></li>
										<li><span>质量机构人数</span> <input type="text"
											name="ahrqPeopleCount" class="people-three"
											readonly='readonly' /></li>
										<li><span>质量机构联系方式</span> <input type="text"
											name="nhrqContactWay" class="people-three"
											readonly='readonly' /></li>
										<li><span class="red">委托书有效期</span> <input type="text"
											name="entrustLimitedDate" disabled="disabled"
											class="people-three input-back" /></li>
										<li><span style="font-size: 12px;">机构代码证有效期</span> <input
											name="organizationLimitedDate" type="text"
											disabled="disabled" class="people-three input-back" /></li>
										<li><span class="red">许可证有效期</span> <input type="text"
											name="certificateEndDate" disabled="disabled"
											class="people-three input-back" /></li>
										<li><span class="red">执照有效期</span> <input type="text"
											name="businessEndDate" disabled="disabled"
											class="people-three input-back" /></li>
										<li><span style="display: inline-block;width: 300px;"><span
												class="red" style="width: 115px;">质保协议起始日期</span> <input
												name="qualityStartDate" type="text" disabled="disabled"
												class="people-three input-back" /> </span> <span class="red">质保协议有效期</span>
											<input type="text" class="people-three input-back"
											name="qualityEndDate" disabled="disabled" /></li>
									</ol>
								</div>
								<div style="margin: 5px 0 0 27px;">
									<span>备注</span> <input type="text" name="remark"
										style="width: 554px; height: 23px;" readonly='readonly' />
								</div>
							</form>
						</div>
						<div class="lower">
							<table id="supplierPeople_table"
								class="table table-border table-bordered table-hover table-bg"
								width="2200">
								<thead>
									<tr class="text-c">
										<th>编号</th>
										<th>名称</th>
										<th>职务</th>
										<th>身份证号</th>
										<th>授权区域</th>
										<th>授权起始日期</th>
										<th>授权结束日期</th>
										<th>人员备注</th>
									</tr>
								</thead>
								<tbody>
								</tbody>
							</table>
						</div>
					</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-primary" data-dismiss="modal"
						onclick="toProvider()">确定</button>
					<button type="button" class="btn btn-white" data-dismiss="modal">取消</button>
				</div>
			</div>
		</div>
	</div>

	<script type="text/javascript"
		src="/Medical_Instrument/statics/lib/jquery/1.9.1/jquery.min.js"></script>
	<script type="text/javascript"
		src="/Medical_Instrument/statics/lib/layer/2.4/layer.js"></script>
	<script type="text/javascript"
		src="/Medical_Instrument/statics/h-ui/js/H-ui.min.js"></script>
	<script type="text/javascript"
		src="/Medical_Instrument/statics/h-ui.admin/js/H-ui.admin.js"></script>
	<!--/_footer 作为公共模版分离出去-->

	<script type="text/javascript"
		src="/Medical_Instrument/statics/lib/My97DatePicker/4.8/WdatePicker.js"></script>
	<script type="text/javascript"
		src="/Medical_Instrument/statics/lib/datatables/1.10.0/jquery.dataTables.min.js"></script>
	<script type="text/javascript"
		src="/Medical_Instrument/statics/lib/laypage/1.2/laypage.js"></script>
	<script type="text/javascript"
		src="/Medical_Instrument/statics/js/gsp/business_manage/moment.js"></script>
	<script type="text/javascript"
		src="/Medical_Instrument/statics/js/gsp/supplier_manage/supplier_manage.js"></script>
	<script type="text/javascript">
		$(function() {
			$(".modal-body-content").scroll(function() {
				//var top = $(window).scrollTop() + 200;
				var left = $$(".modal-body-content").scrollLeft() + 20;
				$(".aginate_button").animate({
					"left" : left
				}, 30); //方式一 效果比较理想
				//$("#editInfo").css({ left: left + "px", top: top + "px" }); 方式二 有阴影
			});
			/* 
			 $('.table-sort').dataTable({
			 "aaSorting": [
			 [1, "desc"]
			 ], //默认第几个排序
			 "bStateSave": true, //状态保存
			 "aoColumnDefs": [
			 //{"bVisible": false, "aTargets": [ 3 ]} //控制列的隐藏显示
			 {
			 "orderable": false,
			 "aTargets": [0] // 制定列不参与排序
			 }
			 ]
			 }); */
			/*$('.table-sort tbody').on( 'click', 'tr', function () {
				if ( $(this).hasClass('selected') ) {
					$(this).removeClass('selected');
				}
				else {
					table.$('tr.selected').removeClass('selected');
					$(this).addClass('selected');
				}
			});*/

			$('td').parent().click(function() {
				$(this).toggleClass('back-color');
				$(this).siblings().removeClass('back-color');
			});

		});

		function change_back(obj, num) {
			obj.css("background", "dodgerblue");
			obj.siblings().css("background", "lightsteelblue");

			var ssdf = $('.modal-body-content').children(
					'div:nth-of-type(' + num + ')');
			$('.modal-body-content').children('div:nth-of-type(' + num + ')')
					.css('display', 'block');
			$('.modal-body-content').children('div:nth-of-type(' + num + ')')
					.siblings().css('display', 'none');
		}

		$("#providerList tbody").on('click', 'tr', function() {
			if ($(this).hasClass('selected')) {
				$(this).removeClass('selected');
			} else {
				$("#providerList tr.selected").removeClass('selected');
				$(this).addClass('selected');
			}
		});
	</script>
</body>

</html>